.root{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.textLeft{
   margin-left: 14px;
   text-align: left;
   padding:4px;
   background-color: rgb(96, 230, 96);
   border-radius: 8px;
 


 }
 .textRight{
   margin-right: 14px;
   text-align: right;
   padding:4px;
   background-color: rgb(96, 230, 96);
   border-radius: 8px;
  
 }
 .chatItemLeft{
   margin-top: 20px;
   display: flex;
   justify-content: flex-start;
 }
 .chatItemRight{
   margin-top: 20px;
   display: flex;
   justify-content: flex-end;
 

 }
 .photo{
   height: 32px;
   width: 32px;
   border-radius: 4px;
   background-color: antiquewhite;
 }
 .inputDiv{
   display: flex;
   align-items: center;
   margin-top: 20px;
   box-sizing: border-box;
 }
 .mr20{
   margin-right: 20px;
 }
  .ml20{
   margin-right: 20px;
 }
 .chatListContainer{
   max-height: 500px;
   overflow-y: scroll;
   padding-right: 30px;
 }
/* 滚动条整体样式 */
.chatListContainer::-webkit-scrollbar {
   width: 5px;
   height: 10px;
   background-color: #f5f5f5;
}

/* 滚动条thumb(滑块)样式 */
.chatListContainer::-webkit-scrollbar-thumb {
   width: 5px;
   height: 10px;
   background-color: #9a9a9a;
}

/* 滚动条hover状态下thumb(滑块)样式 */
.chatListContainer::-webkit-scrollbar-thumb:hover {
   background-color: #555;
}

/* 滚动条上下箭头样式 */
.chatListContainer::-webkit-scrollbar-button {
   background-color: #ccc;
   display: none;
}

/* 滚动条左右箭头样式 */
.chatListContainer::-webkit-scrollbar-button:start:decrement, .chatListContainer::-webkit-scrollbar-add-button {
   display: none;
}

.chatListContainer::-webkit-scrollbar-button:end:increment, .chatListContainer::-webkit-scrollbar-sub-button {
   display: none;
}

